<template>
  <div class="content1">
    <div class="header">
      <p v-if="token">{{ ` ${phone.slice(0, 3)}****${phone.slice(-4)}` }}</p>
      <router-link to="/login" v-else class="denglu">立即登录</router-link>
    </div>
    <div class="body">
      <router-link to="/myorder" class="myorder">
      <div class="box">
        <span>我的订单</span>
        <i class="iconfont icon-xiangyoujiantou"></i>
      </div>
      </router-link>
      <div class="box">
        <span>收藏</span>
        <i class="iconfont icon-xiangyoujiantou"></i>
      </div>
      <div class="box">
        <span>足迹</span>
        <i class="iconfont icon-xiangyoujiantou"></i>
      </div>
      <div class="box">
        <span>我的地址</span>
        <i class="iconfont icon-xiangyoujiantou"></i>
      </div>
      <div class="box">
        <span>优惠券</span>
        <i class="iconfont icon-xiangyoujiantou"></i>
      </div>
      <router-link to="/shezhi">
        <div class="box">
          <span class="shezhie">设置</span>
          <i class="iconfont icon-xiangyoujiantou"></i>
        </div>
      </router-link>
    </div>
    <Footer />
  </div>
</template>

<script>
import { mapState } from "vuex";
import $axios from "../../api/request";
import Footer from "../../components/Footer.vue";
export default {
  computed: {
    ...mapState(["phone", "token"]),
  },
  components: {
    Footer,
  },
};
</script>
<style lang="scss" scoped>
@import "./my.scss";
</style>